@import url('../../../assets/config.less');
@import url('../../../assets/style.less');
.el-button{
  &.open{
    @red:color(#F5222D);
    border-color:@red;
    background-color:lighten(@red,40%);
    color:@red;
  }
  &.active{
    background-color:lighten(@blue,0%);
    color:#fff;
  }
}
.panel{
  @HH:56;@FH:40;
  .panel(@HH:unit(@HH,px),@FH:unit(@FH,px));
  &-header{
    font-size:16px;
    line-height: unit(@HH,px);
    padding-left:unit((@defPadding/2),px);
    padding-right:unit((@defPadding/2),px);
  }
  &-body{
    overflow: auto;
  }
  &-footer{
    padding-left:unit((@defPadding/2),px);
    font-size:12px;
  }
  .footer{
    height:unit(@FH,px);
    padding:0 unit((@defPadding/2),px);
  }
}
.list{
  @timeW:160;
  @infoW:300;
  @infoW2:180;
  .item{
    font-size:14px;
    line-height:40px;
    height:40px;
    background-color:darken(#fff,2%);
    cursor: pointer;
    &+.item{
      border-top:1px solid darken(#fff,6%);
    }
    &.active{
      background-color:#1890FF;
      color:#fff;
      .time{color:#fff;}
    }
    .checkbox{
      position: absolute;
      top:0;bottom:0;left:unit((@defPadding/2),px);
      margin:auto;
      pointer-events: none;
    }
    .face{
      position: absolute;
      top:0;bottom:0;left:unit((@defPadding/2),px);
      width:24px;height:24px;
      margin:auto;
      border-radius: 50%;
    }
    .cusInfo{
      position: absolute;
      top:0;bottom:0;left:unit(40,px);
      width:unit(@infoW - 34,px);
      padding-right:30px;
      @media (max-width:unit(@mobile,px)){
        width:unit(@infoW2 - 34,px);
      }
      .badge{
        position: absolute;
        top:6px;bottom:0;right:unit((@defPadding/2),px);
        margin:auto;
      }
    }
    .msg{
      position: absolute;
      top:0;bottom:0;left:unit(@infoW,px);right:unit(@timeW,px);
      /deep/ p{
        padding: 0;
        margin: 0;
      }
      @media (max-width:unit(@mobile,px)){
        left:unit(@infoW2,px);right:unit((@defPadding/2),px);
      }
    }
    .time{
      position: absolute;
      top:0;bottom:0;right:0;
      text-align:right;
      width:unit(@timeW,px);
      padding-right:unit((@defPadding/2),px);
      color:lighten(#000,65%);
      @media (max-width:unit(@mobile,px)){
        display:none;
      }
    }
  }
}
// 修改分页默认样式
.panel-footer /deep/ .el-pagination__sizes {
  float: right;
}

.panel-footer /deep/ .el-pagination.is-background .el-pager li:not(.disabled).active{
  border:1px solid #1890FF!important;
  color: #1890FF!important;
  background-color: #FFFFFF!important;
}
.panel-footer /deep/ .el-pagination.is-background .el-pager li{
//   background-color: #fff;
  // background: #fff;
  background-color: #FFFFFF;
  border: 1px solid #D9D9D9;
}
.panel-footer /deep/ .el-pagination.is-background .btn-prev {
  background-color: #ffffff;
  border: 1px solid #D9D9D9;
}
.panel-footer /deep/ .el-pagination.is-background .btn-next {
  background-color: #ffffff;
  border: 1px solid #D9D9D9;
}

/deep/ .el-footer {
  padding: 0;
  height: 52px!important;
}